<template >

  <el-row>
    <el-col :span="3" v-for="o in historys" :key="o">
      <el-card :body-style="{ padding: '0px' }"
               style="width: 130px">
        <!--<img src="o.image" class="image">-->
        <el-image
        style="width: 130px; height: 100px"
        :src="o.image"
         class="image"></el-image>
        <div style="padding: 0px;">
          <span>{{o.menuName}}</span>
          <div>评分:{{o.score}}分</div>

          <div class="bottom clearfix">
            <el-button type="text" class="button" @click="delHistory(o.id)">删除</el-button>
          </div>

          <!--<div class="bottom clearfix">-->
            <!--<el-button type="text" class="button" @click="todetail(o.id)">进入详情</el-button>-->
          <!--</div>-->

        </div>
      </el-card>
    </el-col>
  </el-row>

</template>

<script>
    import jwtDecode from 'jwt-decode'

    export default {
        name: "history",
        data(){
          return{
            historys: [],


            decode:{
              user:{}
            },

            // user: {
            // },

          }

        },

      methods:{
          historyList:function () {


          var token = window.localStorage.getItem("userS");
          // console.log(user);
          // alert(u)
          // var u= JSON.parse(user);
          // alert(u);
          // alert(u.user);

           // alert(token)


          const decode = jwtDecode(token);

         this.user=JSON.parse(decode.user);
         console.log(this.user.id)
           // alert(this.user.id)




            this.$axios.get("/menu/AllMenuEdByUid?id="+this.user.id).then(res =>{
                this.historys=res.data.data;
            })
          },
          delHistory:function (id) {
            this.$axios.post("/menu/updateMenuDelState?id=" + id).then(res=>{
              alert("删除成功");
              this.historyList();
            })
          },
        todetail:function (id) {
          this.$router.push({name:"historyDetail",params:{id:id}})
        }
      },
      mounted(){
        this.historyList();
      }
    }
</script>

<style scoped>
  .time {
    font-size: 13px;
    color: #999;
  }

  .bottom {
    margin-top: 13px;
    line-height: 12px;
  }

  .button {
    padding: 0;
    float: right;
  }

  .image {
    width: 100%;
    display: block;
  }

  .clearfix:before,
  .clearfix:after {
    display: table;
    content: "";
  }

  .clearfix:after {
    clear: both
  }

</style>
